<template>
	<el-drawer title="标记参数" v-model="visible" destroy-on-close size="920">
		<el-container>
			<el-main class="nopadding">
				<el-table :data="tableData" style="width: 100%; height: 100%; margin-bottom: 20px" row-key="tagId">
					<el-table-column property="name" label="标记" width="240" />
					<el-table-column property="displayName" label="标记名称" align="center" width="120" />
					<el-table-column property="address" label="地址" align="center" width="100" />
					<el-table-column property="length" label="长度" align="center" width="60" />
					<el-table-column property="dataType" label="类型" align="center" width="60" />
					<el-table-column property="scanRate" label="扫描速率" align="center" width="80" />
					<el-table-column property="flag" label="标识" align="center" width="80" />
					<el-table-column property="group" label="分组" align="center" width="80" />
					<el-table-column align="center" fixed="right" label="操作">
						<template #default="scope">
							<el-button
								text
								type="primary"
								size="small"
								:disabled="!(scope.row.identity === 'Attach' && scope.row.valueUsage === 'Numerical')"
								@click="setParams(scope.row)"
								>设置</el-button
							>
						</template>
					</el-table-column>
				</el-table>
			</el-main>

			<modify ref="modify" @complete="complete" />
		</el-container>
	</el-drawer>
</template>

<script>
import modify from "./modify";

export default {
    emits: ['complete'],
    components: {
        modify,
    },
    data() {
        return {
            visible: false,
            reqParams: {
                processId: null,
                procCode: '',
                channelName: '',
                tagGroupName: '',
            },
            tableData: [],
        };
    },
    methods: {
        complete() {
            this.$emit("complete");
        },
        async open(item) {
            this.reqParams.processId = item.processId;
            this.reqParams.procCode = item.procCode;
            this.reqParams.channelName = item.lineCode;
            this.reqParams.tagGroupName = item.opCode;

            const resp = await this.$API.scadadeviceapi.tags.get(this.reqParams);
            this.tableData = resp.data;
            this.visible = true;
        },
        setParams(row) {
            const stepMax = row.isArray ? row.length : 0;
            const param = Object.assign({}, this.reqParams, { tagName: row.name }, { tagDisplayName: row.displayName }, { stepMax });
            this.$refs.modify.open(param);
        }
    },
};
</script>
